﻿<%@ Page Title="" Language="C#" MasterPageFile="~/controlasistencia/Plantilla.Master" AutoEventWireup="true" CodeBehind="JustificacionEspecialAdmin.aspx.cs" Inherits="Presentacion.controlasistencia.JustificacionEspecialAdmin" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="contenido" runat="server">
    <form id="form1" runat="server">
        <div class="row">
            <div class="col-lg-12">
                <div class="page-title">
                    <h2>ASISTENCIAS ESPECIALES
                        <small>
                            <asp:Label ID="lblCarrera" runat="server" Text="">ADMINISTRADOR</asp:Label></small>
                    </h2>
                    <ol class="breadcrumb">
                        <li><i class="fa"></i><a href="index.aspx" class="tamano-breadcrumbs">Inicio</a>
                        </li>
                        
                        <li class="active tamano-breadcrumbs">Asistencias especiales</li>
                    </ol>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="portlet portlet-default">
                <div class="portlet-heading">
                    <div class="portlet-title">
                        <h4>ASISTENCIAS ESPECIALES</h4>
                    </div>
                    <div class="portlet-widgets">
                        <span class="divider"></span>
                        <a data-toggle="collapse" data-parent="#accordion" href="#justificacion"><i class="fa fa-chevron-down"></i></a>
                    </div>
                    <div class="clearfix">
                    </div>
                </div>
                <div id="justificacion" class="panel-collapse in">
                    <div class="portlet-body">
                        <div class="row">
                           
                            <div class="col-lg-3">
                                <h4>DESDE</h4>
                                <input class="form-control" type="date" id="txtFechaInicio" runat="server" />
                            </div>
                            <div class="col-lg-3">
                                <h4>HASTA</h4>
                                <input class="form-control" type="date" id="txtFechaFin" runat="server" />
                            </div>
                            <div class="col-lg-2">
                                <h4>TIPO</h4>
                                <div>
                                    <select runat="server" id="tipoJustificacion" class="form-control" disabled="disabled">
                                       
                                        <option value="2">Especial</option>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-2">
                                <h4>CÉDULA</h4>
                                <div>
                                    <asp:TextBox ID="txtCedula" runat="server" CssClass="form-control" MaxLength="14"></asp:TextBox>
                                    <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ErrorMessage="RegularExpressionValidator" ControlToValidate="txtCedula" ValidationExpression="^\d+$"></asp:RegularExpressionValidator>
                                </div>
                            </div>
                            <div class="col-lg-2">
                                <h4>&nbsp</h4>
                                
                                <div>
                                    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Buscar!" CssClass="btn btn-green btn-block" ClientIDMode="Static" />
                                </div>
                            </div>
                        </div>
                        <div class="row" id="datos">
                            <div class="col-lg-4">
                                </br>
                                    <div class="portlet portlet-green">
                                        <div class="portlet-heading">
                                            <div class="portlet-title">
                                                <h4>DATOS DEL ALUMNO</h4>
                                            </div>
                                            <div class="clearfix"></div>
                                        </div>
                                        <%--  </div>--%>
                                        <div class="portlet-body" style="right: inherit">
                                            <div class="table-responsive" runat="server" id="datos_alumno">
                                            </div>
                                        </div>
                                    </div>
                            </div>
                            <div class="col-lg-8">
                                </br>
                           <div class="portlet portlet-green">
                               <div class="portlet-heading">
                                   <div class="portlet-title">
                                       <h4>IN-ASISTENCIAS A CLASES</h4>
                                   </div>
                                   <div class="clearfix"></div>
                               </div>
                               <div class="portlet-body" style="right: inherit">
                                   <div class="table-responsive" id="datos_faltas" runat="server">
                                   </div>
                               </div>
                           </div>
                                <!-- /.portlet -->
                            </div>
                            <!-- /.col-lg-6 -->
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <div class="modal <%--modal-flex--%> fade" id="popup" tabindex="-1" role="dialog" aria-labelledby="flexModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="flexModalLabel">Panel de Justificación</h4>
                    </div>
                    <div class="modal-body">
                        <%--<div class="col-lg-12">--%>
                        <div class="portlet portlet-green">
                            <div class="portlet-heading" style="align-content: initial">
                                <div class="portlet-widgets">
                                    <div class="portlet-title">
                                        <p>Subir Archivo</p>
                                    </div>
                                    
                                </div>
                                <div class="clearfix"></div>
                            </div>
                            <div id="purplePortlet" class="panel-collapse collapse in">
                                <div class="portlet-body">
                                    <div id="Div1" class="tab-content">
                                        <div class="tab-pane fade in active" id="tab1">
                                            <div class="form-group">
                                                <label for="exampleInputFile">Justificación.pdf</label>
                                                <asp:FileUpload runat="server" ID="file" accept="application/pdf" />
                                                <p class="help-block">Subir archivo justificante</p>
                                            </div>
                                        </div>
                                        
                                    </div>
                                </div>
                            </div>
                        </div>
                       <div class="row">
                            <div class="col-lg-12">    
                                <div class="portlet-heading">
                                    <h4>Observaciones:</h4>
                                </div>
                                <textarea rows="3" cols="45" placeholder="Limit 250 characters." maxlength="250" style="resize: none" class="form-control" runat="server" id="textObservacion"></textarea>
                        
                            </div>
                        </div>
                    
                        <div class="modal-footer">
                            <asp:Button ID="btnCancelar" runat="server" OnClick="Button3_Click" Text="CANCELAR" CssClass="btn btn-blue" />
                            <asp:Button ID="btnConfirmar" runat="server" OnClick="Button2_Click" Text="CONFIRMAR!" CssClass="btn btn-green" />
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
        </div>
        <script>
              $('[data-toggle="confirmation2"]').confirmation({
                placement: 'top', // How to position the confirmation - top | bottom | left | right
                trigger: 'click', // How confirmation is triggered - click | hover | focus | manual
                title: 'Esta seguro?', // Default title value if `data-title` attribute isn't present  
                template: '<div class="popover" >' +
                    '<div class="arrow"></div>' +
                    '<h3 class="popover-title"></h3>' +
                    '<div class="popover-content text-center">' +
                    '<div id="botones" class="btn-group">' +
                    '<asp:LinkButton ID="LinkButton1" runat="server" CssClass="btn btn-success btn-xs" ><i class="fa fa-check-circle icon-white"></i>Si!</asp:LinkButton>' +
                    '<a class="btn btn-xs" data-dismiss="confirmation"></a>' +
                    '</div>' +
                    '</div>'
            , btnOkClass: 'btn-primary'
            , btnOkIcon: 'fa fa-check-circle'
            , btnCancelClass: 'btn-danger'
            , btnOkLabel: 'Si'
            , btnCancelIcon: 'fa fa-times-circle'
            , btnCancelLabel: 'No',
                singleton: true, // Set true to allow only one confirmation to show at a time.
                popout: false, // Set true to hide the confirmation when user clicks outside of it.
                onConfirm: function () {
                }, // Set event when click at confirm button
                onCancel: function () { }
            }) // Set event when click at cancel button
        </script>    
    </form>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="script" runat="server">
     <!-- HISRC Retina Images -->
    <!-- PAGE LEVEL PLUGIN SCRIPTS -->
    <script src="js/plugins/bootstrap-tokenfield/bootstrap-tokenfield.min.js"></script>
    <script src="js/plugins/bootstrap-tokenfield/scrollspy.js"></script>
    <script src="js/plugins/bootstrap-tokenfield/affix.js"></script>
    <script src="js/plugins/bootstrap-tokenfield/typeahead.min.js"></script>
    <script src="js/plugins/bootstrap-maxlength/bootstrap-maxlength.js"></script>
    <script src="js/plugins/bootstrap-timepicker/bootstrap-timepicker.min.js"></script>
    <script src="js/plugins/bootstrap-datepicker/bootstrap-datepicker.js"></script>

    <!-- THEME SCRIPTS -->
    <script src="js/demo/advanced-form-demo.js"></script>
    <script type="text/javascript">
        function callModal() {
            $('#popup').modal('hide');
        }
        function callModal2() {
            $('#popup').modal('show')
        }
        
    </script>
</asp:Content>
